<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ include file="/pages/safeai/jsp/common/taglibs.jsp"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>会员登录 - 锐意网 - 中文最大网上摄影器材商城</title>

<link href="${ctx}/css/style.css" rel="stylesheet" type="text/css" /> 
<script type='text/javascript' src='${ctx}/js/Ajax.js'></script>
<script type='text/javascript' src='${ctx}/dwr/engine.js'></script>
<script type='text/javascript' src='${ctx}/dwr/util.js'></script>

<script language="JavaScript" src="${ctx}/js/jquery.js"></script>
<script language="JavaScript" src="${ctx}/js/filter.js"></script>
<script language="JavaScript" src="${ctx}/js/json2.js"></script>

<script language="javascript"> 
	function check1(){ 
		var form = document.getElementsByTagName("form")[1];
		var vip = document.getElementById("vipcard").value;
		var password = document.getElementById("password3").value;
		
		if(vip == null || vip == ""){
			document.getElementById("vipcard").focus();
			document.getElementById("loginUserNameMsg").style.display="";
        	document.getElementById("loginUserNameMsg").style.color="red";
			return;
		}
		document.getElementById("loginUserNameMsg").style.display="none";
		
		if(password == null || password == ""){
			document.getElementById("password3").focus();
			document.getElementById("loginPassMsg").style.display="";
        	document.getElementById("loginPassMsg").style.color="red";
			return;
		}
		document.getElementById("loginPassMsg").style.display="none";
		
		document.getElementById("password").value = password;
		form.submit();
	}
	
	function check2(){ 
		var form = document.getElementsByTagName("form")[1];
		var username = document.getElementById("username").value;
		var password0 = document.getElementById("password0").value;
		var password1 = document.getElementById("password1").value;
		var mail = document.getElementById("mail").value;
		
		document.getElementById("userNMsg1").style.display="none";
		document.getElementById("passMsg1").style.display="none";
		document.getElementById("pass2").style.display="none";
		document.getElementById("pass1").style.display="none";
		document.getElementById("mail1").style.display="none";
		document.getElementById("mail2").style.display="none";
		document.getElementById("regCheckboxYMsg").style.display="none";
		document.getElementById("userNMsg2").style.display="none";
		document.getElementById("passMsg2").style.display="none";
		document.getElementById("regUserNameMsg").style.display="none";
		
		if(username == null || username == ""){
			document.getElementById("username").focus();
			
			document.getElementById("userNMsg1").style.display="";
        	document.getElementById("userNMsg1").style.color="red";
			return;
		} 
		
		if(password0 == null || password0 == ""){
			document.getElementById("password0").focus();
			
			document.getElementById("passMsg1").style.display="";
        	document.getElementById("passMsg1").style.color="red";
			return;
		} 
		
		if(password1 == null || password1 == ""){
			document.getElementById("password1").focus();
			
			document.getElementById("pass2").style.display="";
        	document.getElementById("pass2").style.color="red";
			return;
		} 
		
		if(password0 != password1){
			document.getElementById("password1").focus();
			document.getElementById("password1").value = "";
			
			document.getElementById("pass1").style.display="";
        	document.getElementById("pass1").style.color="red";
			return;
		} 
		
		if(mail == null || mail == ""){
			document.getElementById("mail").focus();
			document.getElementById("mail1").style.display="";
        	document.getElementById("mail1").style.color="red";
			return;
		}
		if(mail.search(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/) != -1){
		//if(/^\w+@\w+\.\w+/.test(mail)){
		}else{
			document.getElementById("mail").focus();
			document.getElementById("mail2").style.display="";
        	document.getElementById("mail2").style.color="red";
			return;
		}
 
		if(!document.getElementById("checkboxY").checked){
			document.getElementById("regCheckboxYMsg").style.display="";
        	document.getElementById("regCheckboxYMsg").style.color="red";
			return;
		} 
		
		if(username.length<4 || username.length>20){
			document.getElementById("username").focus();
			
			document.getElementById("userNMsg2").style.display="";
        	document.getElementById("userNMsg2").style.color="red";
			return;
		} 
		
		var unst = username.replace("-","").replace("_","");
		if(!/^[A-Z0-9]*$/i.test(unst)){
			document.getElementById("username").focus();
			
			document.getElementById("userNMsg2").style.display="";
        	document.getElementById("userNMsg2").style.color="red";
			return;
		}
		
		if(password0.length<4 || password0.length>20){
			document.getElementById("password0").focus();
			
			document.getElementById("passMsg2").style.display="";
        	document.getElementById("passMsg2").style.color="red";
			return;
		} 
		
		var pwst = password0.replace("-","").replace("_","");
		if(!/^[A-Z0-9]*$/i.test(pwst)){
			document.getElementById("password0").focus();
			
			document.getElementById("passMsg2").style.display="";
        	document.getElementById("passMsg2").style.color="red";
			return;
		}
		
		if(document.getElementById("isUserName").value == 0){
			document.getElementById("username").focus();
        	document.getElementById("regUserNameMsg").style.display="";
        	document.getElementById("regUserNameMsg").style.color="red";
			return;
		} 
		 
		document.getElementById("password").value = password0;
		document.getElementById("method_id").value = "reg";
		document.floginForm.submit();
	}
	
	function check3(){ 
		document.getElementById("username").value = "";
		document.getElementById("password0").value = "";
		document.getElementById("password1").value = "";
		document.getElementById("mail").value = ""; 
	}
	
	function checkUserName(){
        var ajax=new Ajax();
        var uname = document.getElementById("username").value;
        ajax.ajaxRequest("${ctx}/front/login.do","method=checkUserName&username="+uname,"get",back);
    }
    
    function back(str){
        if(str=="OK"){
        	document.getElementById("isUserName").value = 1;
        	document.getElementById("regUserNameMsg").style.display="none";
        }
        
        if(str=="FAIL"){
        	document.getElementById("isUserName").value = 0;
        	document.getElementById("regUserNameMsg").style.display="";
        	document.getElementById("regUserNameMsg").style.color="red";
        }
    }
    
    function subckeck(e){
    	if(e.keyCode == 13){
    		check1();
    	}
    }
    
</script>
</head>

<body>

<div class="bg">
  <div class="bg_inside">
  <div class="head">
	<c:import url="/pages/safeai/jsp/shop/header.jsp"></c:import>
  </div>  
<div class="middle">  
<form action="${ctx}/front/login.do" method="post" name="floginForm">
<input type="hidden" name="method" value="login" id="method_id" />
<input type="hidden" name="hisForward" value="${hisForward}" />
<input type="hidden" name="sfkaifp" id="sfkaifp"/>
<input type="hidden" name="totalSum" id="totalSum"/>
<input type="hidden" name="invoiceSum" id="invoiceSum"/>
<input type="hidden" name="invoiceCountsum" id="invoiceCountsum"/>
<input type="hidden" name="pointsum" id="pointsum"/>

<div class="reg_left">
<ul>
<li><img src="${ctx}/images/login_title.jpg"/></li>
<li>
	<logic:notEmpty name="type">
	    <logic:equal name="type" value="0"><select name="reg.account"><option value="0" selected>用户名</option><option value="1">会员卡号</option></select></logic:equal>
		 <logic:equal name="type" value="1"><select name="reg.account"><option value="0">用户名</option><option value="1" selected>会员卡号</option></select></logic:equal>
	</logic:notEmpty>
	<logic:empty name="type">
		<select name="reg.account"><option value="0">用户名</option><option value="1">VIP卡号</option></select>
	</logic:empty>
	<label><input type="text" id="vipcard" maxlength="20" name="reg.vipcard" value="${username}" />
	<div id="loginUserNameMsg" style="display:none">请输入您的用户名或VIP卡号</div></label>
</li>
<li>
	密码　<label><input type="password" id="password3" maxlength="20" onkeyup="subckeck(event)"  /><div id="loginPassMsg" style="display:none">请输入您的密码</div></label>
</li>
<li><logic:notEmpty name="regMsg1"><span style="font-family:'宋体'; font-size:12px; color:#FF0000"><bean:write name="regMsg1"/></span></logic:notEmpty></li>
<li><a href="#" class="reg_button" onclick="check1();">用户登录</a>　<a href="#" onclick="window.open ('${ctx}/findpassword.jsp','newwindow','height=320,width=420,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')"  class="reg_button2">忘记密码?</a></li>
<li>
<label>
	<logic:notEmpty name="username">
	    <input type="checkbox" name="reg.remember" value="1" checked style="border:0px;width:20px;padding:0px;margin:0px" />
	</logic:notEmpty>
	<logic:empty name="username">
		<input type="checkbox" name="reg.remember" value="1" style="border:0px;width:20px;padding:0px;margin:0px" />
	</logic:empty>
</label>
记住用户名
<label>
	<input type="checkbox" name="reg.auto" value="1" style="border:0px;width:20px;padding:0px;margin:0px" />
</label>
自动登录
</li>
</ul>
</div>
 
<div class="reg_right" >
<ul>
<li style="padding-left:65px;width:200px"><img src="${ctx}/images/reg_title.jpg" /></li>
<li>用 户 名　<label><input type="text" id="username" name="reg.username" onchange="checkUserName();" maxlength="20"/><input type="hidden" id="isUserName" value="0"/></label>&nbsp;<div id="regUserNameMsg" style="display:none">用户名已存在</div><div id="userNMsg1" style="display:none">请输入您的确认用户名!</div><div id="userNMsg2" style="display:none">您输入的用户名格式有误,请重新输入!</div></li>
<li style="padding-left:67px;color:#888888">4-20位字符，可由英文，数字及"_","-"组成</li>
<li>用户密码　<label><input type="password" id="password0" maxlength="20"/></label><div id="passMsg1" style="display:none">请输入您的确认密码!</div><div id="passMsg2" style="display:none">您输入的密码格式有误,请重新输入!</div></li>
<li style="padding-left:67px;color:#888888">4-20位字符，可由英文，数字及"_","-"组成</li>
<li>重复密码　<label><input type="password" id="password1" maxlength="20"/></label><div id="pass2" style="display:none">请输入您的确认密码!</div><div id="pass1" style="display:none">两次输入的密码不一致,请输重新输入确认密码!</div><div id="pass3" style="display:none">您输入的密码格式有误,请重新输入!</div></li>
<li>E-mail　　<label><input type="text" id="mail" name="reg.mail" maxlength="40"/></label><div id="mail1" style="display:none">请输入您的邮件地址!</div><div id="mail2" style="display:none">您输入的邮件地址格式有误,请重新输入!</div></li>
<li style="padding-left:67px;color:#888888">接收帐户信息、订单通知、促销活动、优惠券等</li>
<li style="padding-left:67px;">
<label>
	<input type="checkbox" id="checkboxY" value="checkbox" /style="border:0px;width:20px;padding:0px;margin:0px">
</label>
<a href="#" onclick="window.open ('${ctx}/agreement.jsp','newwindow','height=680,width=600,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no')" >我已阅读并同意《锐意网用户协议》</a><div id="regCheckboxYMsg" style="display:none">请您仔细阅览锐意用户协议!</div>
</li>
<li><span style="font-family:'宋体'; font-size:12px; color:#FF0000">${regMsg2}</span></li>
<input type="hidden" id="password" name="reg.password" />
<li style="padding-left:67px;"><a href="#"  class="reg_button" onclick="check2()">完成注册</a>　<a href="#" onclick="check3()" class="reg_button2 ">清除重填!</a></li>
</ul>
</div>
<div style="clear:both;height:0;margin:0;padding:0;font-size:0;"></div>
</form>
</div>


<div class="bottom">
	<%@ include file="/pages/safeai/jsp/shop/bottom.jsp"%>	
	<div class="clearAll"></div>
</div>

</div>
</div>


</body>
</html>